
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>
      YouTube Javascript API Test Page by 495511416
    </title>
    <script src="http://swfobject.googlecode.com/svn/tags/rc3/swfobject/src/swfobject.js" type="text/javascript"></script>
    <style type="text/css">

    body {
      font-family: verdana, helvetica;
      background-color: white;
    }

    #timedisplay {
      border: solid 1px red;
      width: 50px;
    }
    </style>
    <script type="text/javascript">

        function updateHTML(elmId, value) {
          document.getElementById(elmId).innerHTML = value;
        }

        function setytplayerState(newState) {
          updateHTML("playerstate", newState);
        }

        function onYouTubePlayerReady(playerId) {
          ytplayer = document.getElementById("myytplayer");
          setInterval(updateytplayerInfo, 100); //?C100?@?????s?@??
          updateytplayerInfo();

		  alert("ib");
          ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); //?NYoutube"onStateChange"???U??"onytplayerStateChange"?o??function

          ytplayer.addEventListener("onError", "onPlayerError");
        }

        function onytplayerStateChange(newState) {
          setytplayerState(newState);
        }

        function onPlayerError(errorCode) {
          alert("An error occurred: "+ errorCode);
        }

        function updateytplayerInfo() {
          updateHTML("bytesloaded", getBytesLoaded());
          updateHTML("bytestotal", getBytesTotal());
          updateHTML("videoduration", getDuration());
          updateHTML("videotime", getCurrentTime());
          updateHTML("startbytes", getStartBytes());
		  updateHTML("isMuted", isMuted());
		  updateHTML("Volume", getVolume());
		  updateHTML("URL", getURL());
        }

        // functions for the api calls
        function play() {
          if (ytplayer) {
            ytplayer.playVideo();
          }
        }

        function pause() {
          if (ytplayer) {
            ytplayer.pauseVideo();
          }
        }

        function stop() {
          if (ytplayer) {
            ytplayer.stopVideo();
          }
        }

        function getPlayerState() {
          if (ytplayer) {
            return ytplayer.getPlayerState();
          }
        }

        function seekTo(seconds) {
          if (ytplayer) {
            ytplayer.seekTo(seconds, true);
          }
        }

        function getBytesLoaded() {
          if (ytplayer) {
            return ytplayer.getVideoBytesLoaded();
          }
        }

        function getBytesTotal() {
          if (ytplayer) {
            return ytplayer.getVideoBytesTotal();
          }
        }

        function getCurrentTime() {
          if (ytplayer) {
            return ytplayer.getCurrentTime();
          }
        }

        function getDuration() {
          if (ytplayer) {
            return ytplayer.getDuration();
          }
        }

        function getStartBytes() {
          if (ytplayer) {
            return ytplayer.getVideoStartBytes();
          }
        }

        function mute() {
          if (ytplayer) {
            ytplayer.mute();
          }
        }

        function unMute() {
          if (ytplayer) {
            ytplayer.unMute();
          }
        }
		function isMuted() {
		  if(ytplayer){
		  	return ytplayer.isMuted();
		  }
		}
		function setSize(w,h)
		{
			if(ytplayer){
				ytplayer.width = w;
				ytplayer.height = h;
				//ytplayer.setSize(w,h);
			}
		}
		function getVolume()
		{
			if(ytplayer){
				return ytplayer.getVolume();
			}
		}
		function getURL()
		{
			return ytplayer.getVideoUrl();
		}
    </script>
  </head>
  <body id="page">
  <div>
    <div id="ytapiplayer">
      You need Flash player 8+ and JavaScript enabled to view this video.
    </div>
    <script type="text/javascript">

      // allowScriptAccess must be set to allow the Javascript from one domain to access the swf on the youtube domain
      var params = { allowScriptAccess: "always" };
      // this sets the id of the object or embed tag to 'myytplayer'. You then use this id to access the swf and make calls to the player's API
      var atts = { id: "myytplayer" };


swfobject.embedSWF("http://www.youtube.com/v/e4wq-t3uGCE?enablejsapi=1&playerapiid=linkatzelda&version=3", "ytapiplayer", "425", "344", "8", null, null, params, atts);

// http://www.youtube.com/v/xxxxxxxxxxx(number)&amp;border=0&amp;enablejsapi=1&amp;playerapiid=ytplayer  <<<Connect to video
    </script>

    <!-- HTML below here is for display of the player info + state -->
    <div>
      Player state: <span id="playerstate">--</span>
    </div>
    <br />
      <a href="javascript:void(0);" onclick="play();">Play</a> | <a href="javascript:void(0);" onclick="pause();">Pause</a> | <a href="javascript:void(0);" onclick="stop();">Stop</a> | <a href="javascript:void(0);" onclick="mute();">Mute</a> | <a href="javascript:void(0);" onclick="unMute();">Unmute</a> |
    <br /><br />

    <div>Volume: <span id="Volume"></span></div>
    <br />
    <div>Is muted? <span id="isMuted"></span></div>
    <form action="" onsubmit="seekTo(document.getElementById('seekto').value); return false;">
      <div><input id="seekto" type="text" size="4" /><input type="submit" value="Seek to" /></div>
    </form>
    <br />

    <form action="" onsubmit="setSize(document.getElementById('width').value,document.getElementById('height').value); return false;">
     <div>
     	<input id="width" type="text" size="4">Width</input>
        <input id="height" type="text" size="4">Height</input>
        <input type="submit" value="Change size" />
     </div>
    </form>
    <br />
    <form action="" onsubmit="setSize(425,344); return false;" >
    <input type="submit" value="Default Size" />
    </form>
    <br />
    <div>URL: <span id="URL"></span></div>
    <br />
    <br />
    <div>
      Duration: <span id="videoduration">--:--</span> | Current Time: <span id="videotime">--:--</span>
    </div>
    <br />
    <div id="bytesdisplay">
      Bytes Total: <span id="bytestotal">--</span> | Start Bytes: <span id="startbytes">--</span> | Bytes Loaded: <span id="bytesloaded">--</span>
    </div>
  </div>
  </body>
</html>
